
<template>
	<div class="for_index">
		<div class="for_index_top">
			<div class="into_index">首页<i class="el-icon-close"></i></div>
			<div class="current">待收货<i class="el-icon-close"></i></div>
		</div>
		<div class="for_index_bottom">
			<div class="for_index_bottom_new">
				<div class="for_index_bottom_new_goods">
					<div class="for_index_bottom_new_goods_btn">
					</div>
					<div class="for_index_bottom_new_goods_screening">
						<div class="for_index_bottom_new_goods_screening_left">
							<i>下单时间</i>
							 <el-date-picker
							      v-model="valueTime"
							      type="daterange"
								  @change="selectTime"
							      range-separator="至"
							      start-placeholder="开始日期"
							      end-placeholder="结束日期"
							      align="right">
							    </el-date-picker>
						</div>
						<div class="for_index_bottom_new_goods_screening_right">
							<el-input v-model="input" placeholder="请输入订单信息查询"></el-input>
							<button @click="searchList"><i class="el-icon-search"></i>搜索</button>
						</div>
					</div>
				</div>
			</div>
			<div class="for_index_bottom_table_box">
				<div class="for_index_bottom_table">
					 <table>
            <tr>
              <th>订单号</th>
              <th>下单时间</th>
              <th>下单人</th>
              <th>手机号</th>
              <th>商品数量</th>
              <th>总价</th>
              <th>定金</th>
              <th>配送</th>
              <th>操作</th>
            </tr>
            <tr v-for="(v,i) in tableList"
                :key="i">
              <td>{{v.order_code}}</td>
              <td>{{v.create_time | dateformat('YYYY-MM-DD HH:mm:ss')}}</td>
              <td>{{v.username}}</td>
              <td>{{v.mobile}}</td>
              <td>{{v.num}}</td>
              <td>{{v.price}}</td>
              <td>{{v.deposit_price}}</td>
              <td>{{v.move_way=='1'?'快递':v.move_way=='2'?'自提':''}}</td>
              <td>
                <button class="editor"
                        @click='_toShopInfo(v.id)'>详情</button>
                <button class="shelves">核销码</button>
                <!-- <button class="delete">关闭订单</button> -->
              </td>
            </tr>
            <tr v-if="tableList.length == 0">
              <td class="table_title"
                  colspan="8">当前数据空空如也</td>
            </tr>
          </table>
				</div>
			</div>
		</div>
		<div class="for_index_bottom_page">
			<div class="for_index_bottom_page_left">
			</div>
			<div class="for_index_bottom_page_right">
				  <el-pagination
				      @size-change="handleSizeChange"
				      @current-change="handleCurrentChange"
				      :current-page="page"
				      :page-sizes="[10, 20, 30, 40]"
				      :page-size="pagesize"
				      layout="total, sizes, prev, pager, next, jumper"
				      :total="total"
					  background>
				    </el-pagination>
			</div>
		</div>
	</div>
</template>

<script>
	export default {
		data() {
		     return {
				input: '',
				checkAll:false,
				currentPage4:1,
				checkBoxAll:[],				// 选中的数据
				page:1,
				pagesize:10,
				total:0,
				tableList:[],
				sid:null,
				valueTime:[],
				startDate:'',
				endDate:''
			}
		},
		mounted() {
			 this.sid = localStorage.getItem('sid')
			this._getOrdersList()
		},
		methods: {
			handleSizeChange(val) {
			    console.log(`每页 ${val} 条`);
				this.pagesize = val
				this._getOrdersList()
			},
			handleCurrentChange(val) {
			    console.log(`当前页: ${val}`);
				this.page = val
				this._getOrdersList()
			},
			handerInto() {
				this.$router.push({path:'/forDetails'});
			},
			// 获取待发货订单
			_getOrdersList(){
				let params = {
					order_status:3,
					page:this.page,
					pagesize:this.pagesize,
					keyword:this.input,
					start_date:this.startDate,
					end_date:this.endDate
				}
				this.$http.post("/api/root/PackOrder/lst",params).then(res=>{
					if(res.code==1){
						this.tableList=res.data.data?res.data.data:[];
						this.total = res.data.count;  //总条数
					}
				})
			},
			
			// 搜索按钮
			searchList(){
				this._getOrdersList()
			},

			// 时间选择
			selectTime(e){
				console.log(e,'时间');
				if(e){
					this.startDate = this.$moment(e[0]).format('yyyy-MM-DD')
					this.endDate = this.$moment(e[1]).format('yyyy-MM-DD')
				}else{
					this.startDate = ''
					this.endDate = ''
				}
				this._getOrdersList()
			},

			//点击详情跳转
			_toShopInfo(order_id){
				this.$router.push({path:`/forDetails?order_id=${order_id}`})
			}
		},
	}
</script>

<style lang="less" scoped="scoped">
	@import 'index.less';
</style>
